<template>
	<view>
		<view class="mine-header">
			<image src="/static/assert/default_avatar.png" class="avatar"></image>
			<view class="nav-menu" v-if="userinfo == null">
				<navigator url="/pages/auth/login">{{ lang.login }}</navigator>
				<text>/</text>
				<navigator url="/pages/auth/register">{{ lang.registered }}</navigator>
			</view>
			<view class="login-user" v-if="userinfo != null">
				<view class="">账户：{{ userinfo.Customer.loginId  }}</view>
				<view class="">余额:{{ userinfo.Customer.balance }} USDT</view>
			</view>
		</view>
		<view class="auth-bg"><image src="/static/assert/auth-bg.png" mode=""></image></view>
		<!-- 入金没有登录时 -->
		<view v-if="userinfo == null" class="option-menu" @tap="$nav('/pages/auth/login')">
			
				<view>
					<image src="/static/assert/chongbi.png"></image>
					<text>充值</text>
				</view>
				<view>
					<image src="/static/assert/tibi.png" class="tibi-icon"></image>
					<text>出金</text>
				</view>
		</view>
		<!-- 入金登录后 -->
		<view v-if="userinfo!= null" class="option-menu">
			<view @tap="Chargemoney">
				<image src="/static/assert/chongbi.png"></image>
				<text><a :href="'https://view.dupont-ex.com/KYing/income/incomewx?cusid=' + userinfo.Customer.loginId + '&cussign=' + userMsg" target="_blank" rel="noopener noreferrer">充值</a></text>
			</view>
			<view @tap="Mentionmoney">
				<image src="/static/assert/tibi.png" class="tibi-icon"></image>
				<text><a :href="'https://view.dupont-ex.com/KYing/income/applywx?cusid=' + userinfo.Customer.loginId + '&cussign=' + userMsg" target="_blank" rel="noopener noreferrer">出金</a></text>
			</view>
		</view>

		<view class="mine-menu-list">
			
			<!-- 身份认证 -->
			
			<view class="mine-menu-li" @tap="$nav('./certification/index')">
				<!-- <image src="/static/assert/idcard-icon.png" class="thunmb idcard"></image> -->
				<view class="left-view">
					<text class="menu-tilte">{{ lang.authentication }}</text>
					<image src="/static/assert/more-icon.png" class="more-icon"></image>
				</view>
			</view>
			
			
			
			<!-- 充值记录 -->
			<view class="mine-menu-li" @tap="$nav('/pages/mein/Prepaid')">
				<!-- <image src="/static/assert/C2C.png" class="thunmb idcard"></image> -->
				<view class="left-view">
					<text class="menu-tilte">充值记录</text>
					<image src="/static/assert/more-icon.png" class="more-icon"></image>
				</view>
			</view>
			<!-- 出金记录 -->
			<view class="mine-menu-li" @tap="$nav('/pages/mein/Prepaid1')">
				<!-- <image src="/static/assert/C2C.png" class="thunmb idcard"></image> -->
				<view class="left-view">
					<text class="menu-tilte">出金记录</text>
					<image src="/static/assert/more-icon.png" class="more-icon"></image>
				</view>
			</view>

			
			<!-- 帮助 -->
			<view class="mine-menu-li" @tap="$nav('./Helpcenter')">
				<!-- <image src="/static/assert/help-icon.png" class="thunmb help"></image> -->
				<view class="left-view">
					<text class="menu-tilte">{{ lang.Helpcenter }}</text>
					<image src="/static/assert/more-icon.png" class="more-icon"></image>
				</view>
			</view>
			<view class="mine-menu-li" @tap="$nav('./Contractorders')">
				<!-- <image src="/static/assert/idcard-icon.png" class="thunmb idcard"></image> -->
				<view class="left-view">
					<text class="menu-tilte">合约订单</text>
					<image src="/static/assert/more-icon.png" class="more-icon"></image>
				</view>
			</view>
			<view class="mine-menu-li" @tap="$nav('./Setupthe')">
				<!-- <image src="/static/assert/setting.png" class="thunmb setting"></image> -->
				<view class="left-view">
					<text class="menu-tilte">{{ lang.Set }}</text>
					<image src="/static/assert/more-icon.png" class="more-icon"></image>
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script>
import md5 from 'js-md5';
import request from '@/utils/request';
import { mapState, mapGetters } from 'vuex';
export default {
	data() {
		return {
			userBank: [],
			typeIndex: '',
			userMsg:"",
			
		};
	},
	created() {
		
	},
	onShow() {		
		
	    this.userMsg = md5('cusappsid='+ this.userinfo.Customer.loginId + '&key=i0qeQ6-3IISHUbAvd6yoFGdQTVDODvGk').toUpperCase()
	},
	computed: {
		...mapState('user', ['userinfo']),
		...mapGetters(['islogin']),
		...mapState(['lang'])
	},
	components: {},
	methods: {
		
		otcgold() {
			uni.navigateTo({
				url: './otcgold'
			});
		},
	
		
		

		// 跳转页面充币
		Chargemoney() {
			uni.navigateTo({
				url: '../coin/in/index'
			});
		},
		// 提币
		Mentionmoney() {
			uni.navigateTo({
				url: '../coin/out/index'
			});
		},
		go(url) {
			if (this.islogin) {
				uni.navigateTo({
					url: url
				});
			} else {
				uni.navigateTo({
					url: '/pages/auth/login'
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
	a{
		    font-size: 28upx;
		    font-family: PingFang-SC-Medium;
		    font-weight: 500;
		    color: #2d2f56;
	}
.login-user {
	display: flex;
	flex-direction: column;
	align-items: center;

	& > view:first-child {
		font-size: 28upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
	}

	& > view:last-child {
		font-size: 22upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
	}
}

.mine-header {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding-top: 90upx;
	padding-bottom: 90upx;
	background: linear-gradient(232deg, rgba(104, 129, 255, 1), rgba(115, 156, 255, 1));

	.avatar {
		width: 115upx;
		height: 115upx;
		margin-bottom: 31upx;
	}

	.nav-menu {
		display: flex;
		font-size: 28upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
	}
}

.option-menu {
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding-bottom: 70upx;

	& > view {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		image {
			width: 38upx;
			height: 38upx;
		}

		.tibi-icon {
			width: 34upx;
			height: 43upx;
		}

		.huazhuan-icon {
			width: 50upx;
			height: 43upx;
		}

		text {
			font-size: 26px;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			color: rgba(45, 47, 86, 1);
			line-height: 26upx;
			margin-top: 17upx;
		}
	}
}

.mine-menu-list {
	padding: 0 30upx;

	.mine-menu-li {
		height: 93upx;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.left-view {
			display: flex;
			align-items: center;
			border-bottom: 1px solid #f0f0f0;
			height: 100%;
			width: 100%;
			margin-left: 34upx;
			justify-content: space-between;

			.more-icon {
				width: 13upx;
				height: 24upx;
				vertical-align: middle;
				margin-left: 30upx;
			}
		}

		.menu-tilte {
			font-size: 30upx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			color: rgba(45, 47, 86, 1);
		}
	}
}

.auth-bg {
	margin-top: -74upx;

	image {
		height: 86upx;
		width: 100%;
	}
}

// icon 大小
.thunmb.accnoutsecurity {
	width: 31upx;
	height: 38upx;
}

.thunmb.idcard {
	width: 38upx;
	height: 31upx;
}

.thunmb.setting {
	width: 41upx;
	height: 37upx;
}

.thunmb.invate-friend {
	width: 39upx;
	height: 36upx;
}

.thunmb.help {
	width: 39upx;
	height: 39upx;
}

.thunmb.kefu {
	width: 39upx;
	height: 41upx;
}
a{
	text-decoration: none;
}
</style>
